import React, { PureComponent,Fragment } from "react";
import { connect } from "dva";
import { Row, Col, Spin, Card, Button, Icon, message } from "antd";
import DescriptionList from '../../../components/DescriptionList';
import PtathCuring from './PtathCuring';
import styles from '../../Pbulic.less';

const { Description } = DescriptionList;

@connect(({ path,loading }) => ({
  pathcuring:path.pathcuring,
  detaildata:path.detaildata,
  loading:path.loading.detailinfo,
}))
export default class DetailInfo extends PureComponent {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    const { match, dispatch } = this.props;
    const detailInfoId = match.params.id && match.params.id!='detail' ? match.params.id : 0;
    dispatch({
      type: "path/fetch_path_info",
      payload: {
        lineId: detailInfoId,
      }
    });
    dispatch({
      type: "path/fetch_path_equipment",
      payload: {
        lineIds: [detailInfoId],
      }
    });
  }





  render() {
    const { match, detaildata, loading, pathcuring } = this.props;
    const detailInfoId = match.params.id && match.params.id!='detail' ? match.params.id : 0;;



    return (
      <Fragment>
        {loading && <div className={"globalSpin"}><Spin spinning={loading}  /></div>}
        {
          !loading && detaildata && detaildata.lineId &&
          <Row gutter={{ md: 8, lg: 24, xl: 48 }} className={styles.small_card}>
            <Col md={8} sm={24} >
              <Card title={"路线信息"}
                    bodyStyle={{padding:24}}
              >
                <DescriptionList col={1} size="large" style={{ marginBottom: 32 }}>
                  <Description term="路线编号">{detaildata.lineCode}</Description>
                  <Description term="路线名称">{detaildata.lineName}</Description>
                  <Description term="保养单位">{detaildata.maintenanceName}</Description>
                  <Description term="联系人">{detaildata.linkman}</Description>
                  <Description term="联系电话">{detaildata.phone}</Description>
                  <Description term="备注">{detaildata.remarks}</Description>
                  <Description term="编制人">{detaildata.creatorName}</Description>
                </DescriptionList>
              </Card>
            </Col>
            <Col md={16} sm={24} >
              <Card
                title={"路线配置"}
                bodyStyle={{padding:'1px 24px 24px 24px'}}
              >
                <PtathCuring
                  detailInfoId={detailInfoId}
                  tableData={pathcuring}
                  onlyview={true}
                />
              </Card>
            </Col>
          </Row>
        }
      </Fragment>
    );
  }
}
